import { ComponentInternalInstance } from 'vue'
import CanvasRenderingContext2D from '../gcanvas/context-2d/RenderingContext.js'
// #ifdef APP-NVUE
import { enable, WeexBridge } from '../gcanvas/index.js'
// #endif

export function getCanvas(
  proxy: ComponentInternalInstance,
  canvasid: string,
  w?: number,
  h?: number,
  is2d = false
): Promise<{ ctx: CanvasRenderingContext2D; node: HTMLCanvasElement | null }> {
  return new Promise((resv, rejv) => {
    // #ifdef APP-NVUE
    setTimeout(async function () {
      /*获取元素引用*/
      const ganvas = proxy?.$refs[canvasid]
      /*通过元素引用获取canvas对象*/
      const canvasObj = enable(ganvas, {
        bridge: WeexBridge,
      })
      resv({ ctx: canvasObj.getContext('2d'), node: canvasObj })
    }, 100)
    // #endif

    // #ifdef MP
    setTimeout(async function () {
      const query = uni.createSelectorQuery().in(proxy)
      // #ifdef MP-ALIPAY

      query
        .select('#' + canvasid)
        .node()
        .exec((res2) => {
          const canvas = res2[0].node
          const ctxvb: UniApp.CanvasContext = canvas.getContext('2d')
          resv({ ctx: ctxvb, node: canvas })
        })
      // #endif

      // #ifndef MP-ALIPAY
      query
        .select('#' + canvasid)
        .fields({
          node: true,
          size: true,
          context: true,
        })
        .exec((res) => {
          const canvas = res[0]?.node ?? null

          if (canvas) {
            const ctx = canvas.getContext('2d')
            const dpr = uni.getSystemInfoSync().pixelRatio
            canvas.width = res[0].width * dpr
            canvas.height = res[0].height * dpr
            if (ctx?.scale) {
              ctx.scale(dpr, dpr)
            }
            resv({ ctx: ctx, node: canvas })
          } else {
            const ctx = res[0]?.context ?? null
            resv({ ctx: ctx, node: null })
          }
        })
      // #endif
    }, 100)
    // #endif

    // #ifdef H5 || APP-VUE
    setTimeout(async function () {
      const query = uni.createSelectorQuery().in(proxy)

      resv({ ctx: uni.createCanvasContext(canvasid, proxy), node: null })
      // return
      // query.select('#'+canvasid)
      // 	.fields({
      // 		node: true,
      // 		size: true,
      // 		context:true
      // 	})
      // 	.exec((res) => {
      // 		const dpr = uni.getSystemInfoSync().pixelRatio
      // 		let canvas = proxy.$el.querySelector('canvas').getContext('2d')
      // 		let canvasEl = proxy.$el.querySelector('canvas')
      // 		canvas.scale(0.1, 0.1)
      // 		resv({ctx:canvas,node:proxy.$el.querySelector('canvas')})
      // })
    }, 50)

    // #endif
  })
}
